<template>
  <div>
    <el-form :inline="true">
      <el-form-item>
        <el-input
          placeholder="姓名、用户名查询"
          @change="getData()"
          clearable
          v-model="params.key"
        ></el-input>
      </el-form-item>
      <el-form-item>
        <select-dept v-model="params.deptLevel" @change="getData()"></select-dept>
      </el-form-item>
      <el-form-item>
        <select-credit-job v-model="params.job" @change="getData()"></select-credit-job>
      </el-form-item>
      <el-form-item>
        <el-button @click="getData()">查询</el-button>
      </el-form-item>
      <el-form-item class="float-right">
        <el-button type="primary" @click="handleEdit" icon="el-icon-plus">新增日志</el-button>
      </el-form-item>
    </el-form>

    <c-table
      border
      class="table-sm"
      v-loading="loading"
      :columns="tableColumns"
      :data="tableData"
    ></c-table>
    <log-detail :visible.sync="visible" :title="userName" :userId="userId"></log-detail>
    <log-edit :visible.sync="editVisible" @success="getData()"></log-edit>
  </div>
</template>

<script>
import SelectDept from '@/components/select/SelectDept'
import SelectCreditJob from '@/credit/components/select/SelectCreditJob'
import LogDetail from '@/credit/views/city/manage/LogDetail'
import { getStaff } from '@/common/api/auth'
import { mapGetters } from 'vuex'
import LogEdit from '@/credit/views/city/manage/LogEdit'
export default {
  components: {
    SelectDept,
    SelectCreditJob,
    LogDetail,
    LogEdit,
  },
  data() {
    return {
      params: {
        index: 1,
        size: 15,
      },
      loading: false,
      tableColumns: [
        { attrs: { label: '姓名', prop: 'realName', align: 'center' } },
        { attrs: { label: '部门', prop: 'deptName', align: 'center' } },
        { attrs: { label: '角色', prop: 'jobName', align: 'center' } },
        { attrs: { label: '电话', prop: 'phoneNumber', align: 'center' } },
        {
          attrs: { label: '操作', align: 'center' },
          operations: [{ content: '查看', icon: 'fa fa-search', event: this.showLog }],
        },
      ],
      tableData: [],
      visible: false,
      userId: '',
      userName: '',
      editVisible: false,
    }
  },

  computed: {
    ...mapGetters(['user']),
    isInside() {
      return this.user.scopeArr.includes('inside')
    },
  },

  created() {
    this.getData()
  },
  methods: {
    getData() {
      this.loading = true
      getStaff(this.params)
        .then(res => {
          let data = res.data || []
          if (!this.isInside) {
            data = data.filter(item => item.userId === this.user.userId)
          }
          this.tableData = data.map(this.dataAdapter)
          this.tableTotal = this.tableData.length
        })
        .finally(() => {
          this.loading = false
        })
    },
    dataAdapter(item) {
      // item.jobName = enumJobCredit[item.job]
      // if (item.job === 'org_corp') {
      //   item.deptName = item.deptName ? item.deptName : '总经办'
      //   item.jobName = '公司负责人'
      // }
      return item
    },
    showLog(row) {
      this.userName = row.realName
      this.userId = row.userId
      this.visible = true
    },
    handleEdit() {
      this.editVisible = true
    },
  },
}
</script>
<style lang="scss" scoped></style>
